<template>
    <el-timeline class="wenjian_list">
        <el-timeline-item
                :timestamp="item.name"
                placement="top"
                v-for="(item, index) of list"
                :key="index"
        >
            <el-card>
                <h4>{{ item.title }}</h4>

                <a :href="`${item.url}?title=${item.name}`" download target="_blank">
                    <el-button type="primary" class="button">
                        下载
                        <i class="el-icon-download el-icon--right"></i>
                    </el-button>
                </a>
                <el-button type="primary" @click="toPreview(index)">
                    预览
                    <i class="el-icon-view el-icon--right"></i>
                </el-button>
            </el-card>
        </el-timeline-item>
    </el-timeline>
</template>
<script>
    import eventBus from "@/utils/eventBus";
    export default {
        props:{
            files:{
                type:String,
                default:"",
            },
        },
        data() {
            return {
                baseUrl:process.env.VUE_APP_BASE_API
            }
        },
        created() {
        },
        computed:{
          list(){
              let retList = []
              let _list = this.files.split(",")
              for(let i=0;i<_list.length; i++){
                  let _ary = _list[i].split("|")
                  let _name = _ary[0]
                  let _url = _ary[_ary.length-1]
                  retList.push({name:this.getSubName(_name),url:_url,id:i})
              }
              return retList
          }
        },
        methods: {
            toPreview(index){
                this.$emit("preview")
                this.$nextTick(function () {
                    eventBus.$emit("activeIndex",index)
                })
            },
            getSubName(fileName){
                let list = fileName.split(".")
                list[0]=list[0].split("_")[0]
                if(list[0].length>20){
                    list[0] = list[0].substring(0,7)+"..."+list[0].substring(list[0].length-7)
                }
                return list.join(".")
            },
        }
    }
</script>
<style lang="scss" scoped>
.wenjian_list {
    padding: 15px;
    height: 100%;
    overflow-y: scroll;
    .el-card__body {
        display: flex;
    }
    .button {
        margin: 10px 10px 0 0;
    }
}
</style>
